<!-- start: Container -->
<?php
$user_contact = $this->user_contact;

?>
<div class="container">
    <!-- start: Page Title Icon-->
    <div id="page-title-icon"></div>
    <div id="page-title-icon-inner">
        <i class="ico-google-maps ico-white"></i>
    </div>
    <!-- end: Page Title Icon-->
    <!-- start: Page Title -->
    <section id="page-title">
        <h2><span>Thông tin của <?php echo $auth->email ?></span></h2>
    </section>
</div>
<div id="wrapper" class="white-wrapper">
    <!-- end: Container  -->
    <!-- start: Container -->
    <div class="container">

        <!-- start: Contact Form -->
        <div class="sixteen columns">

            <div class="form-spacer"></div>

            <!-- Success Message -->
            <div class="success-message">
                <div class="notification success closeable">
                    <p><span>Success!</span> Your message has been sent.</p>
                </div>
            </div>

            <!-- start: Contact Form -->
            <div id="contact-form">
                <form method="post" name="profile-Form" class="require-validate "
                      action="<?php echo $this->url("frontenduser", array('controller' => 'user', 'action' => 'profile')) ?>"
                      enctype="multipart/form-data">
                    <div class="form-left">
                        <div class="field">
                            <label>Họ tên: <span>*</span></label>
                            <input type="text" name="name" class="text" value="<?php echo $auth->name ?>"/>
                            <input type="hidden" name="email" value="<?php echo $auth->email ?>"/>
                            <input type="hidden" name="status" id="status" value="<?php echo $status; ?>">
                        </div>

                        <div class="field">
                            <label>Địa chỉ:</label>
                            <input type="text" name="address" class="text" value="<?php echo $auth->address ?>"/>
                        </div>

                        <div class="field">
                            <label>Điện thoại: </label>
                            <input type="text" name="phone" class="text" value="<?php echo $auth->phone ?>"/>
                        </div>

                        <div class="field">
                            <label>Mật khẩu mới: <span></span></label>
                            <input type="password" id="password" name="password" class="text"/>
                        </div>

                        <div class="field">
                            <label>Nhập lại mật khẩu mới: <span></span></label>
                            <input type="password" name="r_password" class="text"/>
                        </div>

                        <div class="field">
                            <label>Thông tin liên hệ: </label>

                            <div id="contact_field">
                                <?php
                                foreach ($user_contact as $contact_1) {

                                    ?>
                                    <div style="float: left; width: 100%">
                                        <div style="float: left; width: 25%; margin-right: 5%">
                                            <select class="select_contact_type">
                                                <?php
                                                $contact_array = Velacolib\Utility\Utility::contactType();
                                                foreach ($contact_array as $key => $contact) {
                                                    ?>
                                                    <option
                                                        value="<?php echo $key; ?>" <?php if ($contact_1->contact_type == $key) echo 'selected'; ?> ><?php echo $contact; ?></option>'
                                                <?php
                                                }
                                                ?>
                                            </select>
                                        </div>
                                        <div class="" style="float: left; width: 40%">
                                            <input type="text" name="contact[<?php echo $contact_1->contact_type ?>][]"
                                                   class="text" value="<?php echo $contact_1->contact_value ?>">
                                        </div>
                                        <div class="" style="float: left; width: 20%; margin-left: 5%">
                                            <a href="#" class="button btn_delete_contact gray launch"
                                               style="padding-top: 13px; height: 13px; margin-left: 21px;">Delete</a>
                                        </div>

                                    </div>
                                <?php
                                }
                                ?>


                            </div>
                            <a href="#" class="button color launch" id="btn_add_new_contact">Add New Contact</a>
                        </div>
                        <div class="field">
                            <label>Ảnh đại diện: </label>

                            <div class="avatar-dropzone upload">
                                <input type="file" name="avatar"/>
                                <!--<img src="<?php echo $this->basePath(); ?>/templates/front/images/dropzone.png" />-->
                            </div>
                            <div class="preview-avatar">
                                <img style="width: 100px;height: 100px" src="<?php echo $auth->avatar; ?>">
                            </div>
                            <input type="hidden" name="avatar_old" class="text" value="<?php echo $auth->avatar; ?>"/>
                        </div>
                        <div class="clearfix"></div>
                        <div class="field">
                            <input type="submit" id="send" value="Cập nhật"/>

                            <div class="loading"></div>
                        </div>
                </form>
               <!-- <input type="hidden" name="total_sky" value="<?php echo count($user_contact) ?>" id="total_sky"> -->
            </div>
            <!-- end: Contact Form -->

        </div>
        <!-- end: Contact Form -->

    </div>
    <!-- end: Container -->

</div>
</div>
<script type="text/javascript">
    jQuery(document).ready(function () {
        var status = jQuery("#status").val();
        if (status == 1) {
            jsuccess('Cập nhật thành công!');
        }
        $('#btn_add_new_contact').click(function () {
            var content = '<div style="float: left; width: 100%" > <div style="float: left; width: 25%; margin-right: 5%">';
            content += '<select class="select_contact_type">';
            <?php
                $contact_array = Velacolib\Utility\Utility::contactType();
                foreach($contact_array as $key => $contact){
                    ?>
            content += '<option value="<?php echo $key; ?>" ><?php echo $contact; ?></option>';
            <?php
                }
            ?>
            content += '</select>';
            content += ' </div>';
            content += '<div class="" style="float: left; width: 40%">';
            content += '<input  type="text" name="contact[contact_value][1][]" class="text" placeholder="Contact Value">';
            content += '</div>';
            content += '<div class="" style="float: left; width: 20%; margin-left: 5%">';
            content += '  <a href="#" class="button btn_delete_contact gray launch"  style="padding-top: 13px; height: 13px; margin-left: 21px;" >Delete</a>';
            content += '</div>';

            '</div>';
            $('#contact_field').append(content);

            return false;
        })

    });

    $(document).on('click', '.btn_delete_contact', function () {
        $(this).parent().parent().remove();
        return false;
    })
    $(document).on('change', '.select_contact_type', function () {
        var val = $(this).find(":selected").val();
        //$(this).attr('name','contact['+val+'][]');
        $(this).parent().next().children('input').attr('name', 'contact[' + val + '][]');
        //alert(val);
    })
</script>